@import './variables.scss';

[data-theme='christmas'] {
  // 节日装饰类
  .holiday-border {
    border: 2px solid var(--border-holiday);
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(212, 36, 38, 0.1);
  }

  .holiday-text {
    color: var(--text-holiday);
    font-weight: bold;
  }

  // 按钮样式
  .button {
    background: var(--primary-color);
    color: var(--snow-color);
    &:hover {
      background: darken(var(--primary-color), 10%);
    }
  }

  // 卡片样式
  .card {
    background: var(--bg-primary);
    border: 1px solid var(--border-holiday);
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 4px 16px rgba(212, 36, 38, 0.08);
  }

  // 节日装饰元素
  .christmas-decoration {
    &::before {
      content: '🎄';
      margin-right: 8px;
    }
    &::after {
      content: '🎅';
      margin-left: 8px;
    }
  }

  // 标题装饰
  .title-decoration {
    position: relative;
    &::after {
      content: '';
      position: absolute;
      bottom: -4px;
      left: 0;
      width: 100%;
      height: 2px;
      background: linear-gradient(
        90deg,
        var(--candy-red) 25%,
        var(--holly-green) 50%,
        var(--gold) 75%
      );
    }
  }

  // 雪花背景效���
  .snow-bg {
    background-image: radial-gradient(
      var(--snow-color) 1px,
      transparent 1px
    );
    background-size: 16px 16px;
  }
}
